<template>
    <view v-if="shenheStatus == 0" class="mobile">
        <view class="mobile-wrap">
            <u-form label-width="150" :model="form" ref="uForm">
                <u-form-item label="新密码">
                    <u-input v-model="form.password" placeholder="请输入新密码" />
                </u-form-item>
            </u-form>
        </view>
        <view @click="onCLick" class="btn flex-y-center flex-x-center" :class="{ red: isRight }">确认修改</view>
    </view>
    <Shenhe v-else-if="shenheStatus == 1"></Shenhe>
</template>

<script>
    import Shenhe from "@/components/shenhe/shenhe";
    export default {
        components: {
            Shenhe
        },
        computed: {
            isRight: function() {
                if (this.form.password != "" && this.form.password.length >= 6) {
                    return true;
                }
                return false;
            },
        },
        data() {
            return {
                form: {
                    password: ''
                },
            };
        },
        methods: {
            async onCLick() {
                if (this.form.password == "") {
                    this.$u.toast("请输入密码");
                    return;
                }
                if (this.form.password.length < 6) {
                    this.$u.toast("密码不能低于6个字符");
                    return;
                }
                uni.showLoading({
                    title: "修改中",
                });
                let formData = {
                    password: this.form.password,
                };
                const res = await this.$allrequest.user
                    .edit_passowrd(formData);
                uni.hideLoading();
                this.$u.toast(res.msg);
                if (res.code == 0) {
                    setTimeout(() => {
                        this.$utils.goBack();
                    }, 2000);
                }
            }
        },
    };
</script>

<style scoped>
    .mobile {
        min-height: 100vh;
        background: #f2f2f2;
    }

    .mobile-wrap {
        background-color: #fff;
        padding: 0 20rpx;
    }

    .get-code {
        font-size: 28rpx;
        color: #f0250e;
    }

    .btn {
        margin: 0 auto;
        margin-top: 100rpx;
        width: 678rpx;
        height: 88rpx;
        background: rgb(173, 173, 173);
        border-radius: 120rpx;
        font-size: 32rpx;
        font-weight: 500;
        color: #ffffff;
    }

    .btn.red {
        background-color: #f0250e;
    }
</style>